import React,{Component} from 'React'
import {StyleSheet, SafeAreaView, View, Text, Image, Button} from 'react-native'
import CountActions from '../store/actions/CountActions'
import LoginActions from '../store/actions/LoginActions'
import {connect} from 'react-redux'
import { bindActionCreators } from 'redux';
import Toast from '../utils/ToastUtil'
import Modal from 'beeshell/components/Modal';


class Practice extends Component {
    constructor(props) {
        super(props);
        //这里写页面全局变量
        this.state = {
            bol:true
        };
    }
    _renderItem() {
        if(this.state.bol)return <View><Text>{this.props.count}</Text><Text>{this.props.token}</Text></View>
        else return <Text>失败</Text>
    }
    _renderLoginButton() {
        let form = new FormData();
        form.append('loginName','133178')
        form.append('password','ylc123')

        return (
            <Button title={'登录'} onPress={() => {console.log('模拟登录')}}></Button>
        )
    }
    componentDidMount() {
    }
    //这里写页面
    render() {
        return (
            <SafeAreaView>
                {/* {this._renderItem()} */}
                <Button title={'增加'} onPress={() => {this.props.dispatch(CountActions.increase())}}></Button>
                <Button title={'减少'} onPress={() => {this.props.dispatch(CountActions.decrease())}}></Button>
                <Button title={'重置'} onPress={() => {this.props.dispatch(CountActions.reset())}}></Button>
                {this._renderLoginButton()}
                <Button title={'orange'} onPress={() => {Toast.showWarning('请输入正确的验证码')}}></Button>
                <Button title={'green'} onPress={() => {Toast.showSuccess('请输入正确的验证码')}}></Button>
                <Button title={'red'} onPress={() => {Toast.showError('请输入正确的验证码')}}></Button>
                <Button title={'loading'} onPress={() => {Toast.showLoading('加载中…')}}></Button>
                <Button title={'modal'} onPress={() => {this._modal.open()}}></Button>
                <Modal
                    ref={(c) => { this._modal = c; }}
                    cancelable={true}>
                    <View style={{backgroundColor:'white'}}>
                        <Text>ref 获取组件实例</Text>
                        <Text>
                            cancelable={'{'}true{'}'}
                            点击蒙层消失
                        </Text>
                    </View>
                </Modal>
            </SafeAreaView>
        )
    }
}

// function mapStateToProps(state) {
//     return {
//         count:state.CounterReducer.count
//     }
// }
// function mapDispatchToProps(dispatch) {
//     return {
//         login:bindActionCreators(CountActions.login,dispatch)
//     }
// }

export default connect(state => ({count:state.CounterReducer.count,token:state.LoginReducer.loginData.token}))(Practice)
//这里写样式
const styles = StyleSheet.create({
  
})